<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>shop</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<link rel="stylesheet" type="text/css" href="../css/base.css">
	<link rel="stylesheet" type="text/css" href="../css/bootstrap.css" />
	<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="../css/shop.css">
	<link rel="shortcut icon" href="../img/avana.png">
	<script src='../js/jquery.min.js' type="text/javascript"></script>
	<script src="../js/bootstrap.js" type="text/javascript"></script></script>
	<script src="../js/shop.js" type="text/javascript"></script>
</head>
<body>
	<nav class="myNav">
		<div class="navbar-header">
	      <a class="navbar-brand mybrandLink" href="#">
	        <img class="mybrand" src="../img/logo.png" alt="">
	      </a>
	      <span class="glyphicon glyphicon-menu-hamburger menuBtn"></span>
	    </div>
	  <ul class="myMenu nav navbar-nav navbar-right">
	  	<li><a href="../index.html" title="">首页</a></li>
	  	<li class="shop navActive"><a href="shop.html" title="">商店 <span class="glyphicon glyphicon-menu-down"></span></a>
			<ul class="mysecMenu dropdown">
				<li><a href="shop.html" title="">洁面</a></li>
				<li><a href="shop.html" title="">保养</a></li>
				<li><a href="shop.html" title="">美妆</a></li>
			</ul>
	  	</li>
	  	<li><a href="about.html" title="">关于</a></li>
	  	<li><a href="brandStory.html" title="">品牌故事</a></li>
	  	<li><a href="news.html" title="">资讯</a></li>
	  	<li><a href="contact.html" title="">联系</a></li>
	  </ul>
	</nav>

	<!-- 轮播 -->
	<div id="carousel-example-generic" class="carousel slide myslide" data-ride="carousel" data-interval="2000">
		<!-- Indicators -->
		<ol class="carousel-indicators">
			<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
			<li data-target="#carousel-example-generic" data-slide-to="1"></li>
			<li data-target="#carousel-example-generic" data-slide-to="2"></li>
		</ol>

		<!-- Wrapper for slides -->
		<div class="carousel-inner" role="listbox">
			<div class="item active">
				<div class="carousel-caption">
					<h1>洁面</h1>
					<h2>你的美丽应该陪伴你一生</h2>
				</div>
			</div>
			<div class="item">
				<div class="carousel-caption">
					<h1>保养</h1>
					<h2>你的美丽应该陪伴你一生</h2>
				</div>
			</div>
			<div class="item">
				<div class="carousel-caption">
					<h1>美妆</h1>
					<h2>你的美丽应该陪伴你一生</h2>
				</div>
			</div>
		</div>

		<!-- Controls -->
		<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
			<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
			<span class="sr-only">Previous</span>
		</a>
		<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
			<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
			<span class="sr-only">Next</span>
		</a>
	</div>

	<main id="main">
		<div class="row">
			<div id="mymenu" class="col-xs-12 col-sm-2 col-md-2">
				<div class="mymenuBox">
					<p>商品分类</p>
					<ul>
						<li id="clearFaceLink" class="pointBtns">洁面</li>
						<li id="keepFaceLink" class="notActive pointBtns">保养</li>
						<li id="doFaceLink" class="notActive pointBtns">美妆</li>
					</ul>
				</div>
				
			</div>
			<div id="mygoods" class="col-xs-12 col-sm-10 col-md-10">
				<div class="row">
					<h1 class="goodsTitle" id="clearFace">洁面</h1>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="#" title="">
							<img src="../img/goods01.png" alt="">
						</a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods02.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods03.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods04.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods05.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods01.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
				</div>
				<div class="row">
					<h1 class="goodsTitle" id="keepFace">保养</h1>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="#" title="">
							<img src="../img/goods01.png" alt="">
						</a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods02.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods03.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods04.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods05.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods01.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
				</div>

				<div class="row">
					<h1 class="goodsTitle" id="doFace">美妆</h1>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="#" title="">
							<img src="../img/goods01.png" alt="">
						</a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods02.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods03.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods04.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods05.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
					<div class="col-xs-6 col-sm-6 col-md-4">
						<a href="" title=""><img src="../img/goods01.png" alt=""></a>
						<div class="goodsInfo">
							<p class="goodsDescrib">
								抗衰老面霜_蜗牛精华
							</p>
							<p class="price">￥90.00</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</main>

	<footer id="footer">
		<div class="footerTitle">
			<h1>A V A N A</h1>
			<h2>你的美丽应该陪伴你一生</h2>
		</div>
		<hr>
		<div class="row">
			<div id="footerL" class="col-md-6 col-xs-12 col-sm-6">
				<p>电话：100-000-0000</p>
				<p>邮箱：10000@qq.com</p>
				<p>地址：中国互联网省域名市网站区666号</p>
			</div>
			<div class="col-md-1">
			</div>
			<div id="footerR" class="col-md-5 col-xs-12 col-sm-6">
				<p>获取更多美妆资讯:</p>
				<input type="email" name="" value="" placeholder="请输入邮箱">
				<button type="submit">提交</button>
			</div>
		</div>
		<p id="lastText">© Copyright 2018 xxx.com。</p>
	</footer>	

	<div id="goTop">
		<span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>
	</div>
</body>
</html>